<template>
    <div style="width:100%;height: 100%;">
        <div class="taskDetails">
            <!-- <x-header header-background-color="#fff" :left-options="{showBack: true,preventGoBack:true}"  @on-click-back="GoBack">
                <a slot="right" class="vux-close">Feedback</a>
            </x-header> -->
            <div class="taskDetails_content">
                        <div ref="Iofbt" class="right" @click="GoBack">
                            <img src="../../assets/images/dj1_03.png" alt="" srcset="">
                        </div>
                        <div class="divCont" v-if="routeUrl.eventid" :style="formData.finishflag==1?'bottom: 20%;':''">
                            <p>{{formData.eventtitle}}</p>
                            <span>{{formData.occurtime}}</span>
                            <div v-if="formData.finishflag!=1">
                                <div class="one">
                                    您{{formData.dispatchcaseflag==1?'':'将'}}是第<i>{{formData.dispatchcasenum=='0'?1:formData.dispatchcasenum}}</i>支登记出动救援的队伍
                                </div>
                                <div class="two">
                                    事故已发生<i>{{beforeTimeStr}}</i>
                                </div>
                                <div class="three" @click="page">
                                    登记出动情况
                                </div>
                            </div>
                            <div v-else class="one">
                                事件救援已结束
                            </div>
                        </div>
                        <div v-else style="color: #fff;text-align: center;font-size: 18px;">
                            扫描有误
                        </div>
            </div>
        </div>
            <popup v-if="eventModel" v-model="eventModel" height="100%" width="100%" position="right" style="    overflow-x: hidden;">
                    <formElement :flagTrue="true" :refid="routeUrl.eventid" @close="closeInfo"/>
            </popup>
    </div>
</template>
 
<script>
import {XHeader,Previewer,Popup} from 'vux'
import { getDatafindEvent } from '@/assets/js/service'
import formElement from './formElement'
export default {
//   props: ["param"],:itemObj="itemObj" :param='id'
  components: {
      XHeader,
      Previewer,
      formElement,
      Popup
  },
  data () {
    return {
        // taskDetails:{},
        // picturelist:[],
        // picturelistName:[],
        // fujianlist:[],
        eventModel:false,
        routeUrl:{},
        formData:{
            eventtitle:'',
            dispatchcasenum:'0',
            occurtime:""
        },
        beforeTimeStr:'',

    }
  },
  created(){
    var _this = this;
    this.routeUrl=this.$route.query;
    if(this.routeUrl.eventid){
        this.$store.state.eventId = this.routeUrl.eventid;
        this.$vux.loading.show({
            text: '加载中'
        });
        var param={
            "eventid":this.routeUrl.eventid,
            "orgcode":_this.$store.state.user.orgcode,
        };
        getDatafindEvent(param,function(res){
            if(res.status=='200'){
                _this.formData=res.data;
                // _this.formData={
                //     eventtitle:res.data.eventtitle,
                //     dispatchcasenum:res.data.dispatchcasenum,
                //     occurtime:res.data.occurtime
                // }
                _this.$vux.loading.hide();
                let differenceStr= _this.$GetDateDifference(_this.formData.occurtime);
                if(differenceStr){
                    let fristDiff=differenceStr.split(" ");
                    _this.beforeTimeStr=fristDiff[0]+fristDiff[1];
                }
            }else{
                console.log("返回数据异常",res)
                _this.$showBottomToast("请求数据异常！")
            }
        })
    }else{

    }
    
    this.$enJsBack()//调用安卓方法（手机back键返回问题）
  },
  mounted(){
    //   if(this.$isAndroid()){
    //   // 手机顶部状态栏
    //     this.$refs.Iofbt.style.top = 50+'px';
    //       window.android.hideStatusBar();
    //   }else{
    //     //   this.$showBottomToast("进入知识库")
    //   }
    window.GoBack=this.GoBack;//安卓调用GoBack（手机back键返回问题）
  },
  methods: {
    GoBack(){   //调用安卓方法
       //  this.$emit("close")
       window.android.destory();
    },
    closeInfo(){
        this.eventModel = false;
        // if(this.$isAndroid()){
        // // 手机顶部状态栏
        // this.$refs.Iofbt.style.top = 50+'px';
        //     window.android.hideStatusBar();
        // }else{
        //     //   this.$showBottomToast("进入知识库")
        // }
    },
    page(){
        this.eventModel = true;
        // if(this.$isAndroid()){
        //     // 手机顶部状态栏
        //     window.android.setStatusBarColor(this.$converRgbToArgb(23, 157, 229));
        // }else{
        //     //   this.$showBottomToast("进入知识库")
        // }
    },
    go(){
        
    }
  }
}
</script>
 
<style lang="less" scoped>
.taskDetails{width: 100%;height: 100%;}
.taskDetails_content{
    background: url(../../assets/images/dj.png);
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%
}
.right{position: absolute;top: 15px;left: 15px;}
.right img{width: 20px;height: 20px;}
.divCont{position: fixed;bottom: 10%;left: 0;width: 100%;color: #fff;text-align: center}
.divCont p{font-size: 26px;margin-bottom: 8px}
.divCont span{font-size: 14px;margin-bottom: 10px}
.divCont div.one{font-size: 16px}
.divCont div.one i{font-size: 22px;color: #2baf47;font-weight: bold;font-style: normal;margin-left: 5px;margin-right: 5px;}
.divCont div.two i{font-size: 22px;color: #f25206;font-weight: bold;font-style: normal;margin-left: 5px;margin-right: 5px;}
.divCont div.two{font-size: 16px}
.divCont div.three{color: #333333; font-size: 16px; 
-webkit-background-image: linear-gradient(#ebe7e6, #b3b0af);
background-image: linear-gradient(#ebe7e6, #b3b0af);
padding: 10px 40px;
display: inline-block;
border-radius: 35px;
margin-top: 20px;
letter-spacing: 1px;
box-shadow: 0 2px 3px #8d8d90;
-webkit-box-shadow: 0 2px 1px #8d8d90;
}

</style>
<style scoped="this">

</style>